let gulp = require("gulp");
let cssmin = require("gulp-cssmin");
let htmlmin = require("gulp-htmlmin");
let jsmin = require("gulp-uglify");
let gulpBable = require("gulp-babel");
let gulpclean = require("gulp-clean");
let webserver = require("gulp-webserver");

function css() {
    return gulp.src("./css/**").pipe(cssmin()).pipe(gulp.dest("./dist/css"));
  }

  function js() {
    return (
      gulp
        .src("./js/**")
        // 把es6 es7 的代码转换为es5 的代码
        .pipe(
          gulpBable({
            presets: ["env"],
          })
        )
        //在进行压缩
        .pipe(jsmin())
        .pipe(gulp.dest("./dist/js"))
    );
  }

  function html() {
    return gulp
      .src("./html/**")
      .pipe(
        htmlmin({
          collapseWhitespace: true, // 表示去除空格
          removeEmptyAttributes: true, // 移出空的属性
          minifyCSS: true, // 压缩 style 标签
          minifyJS: true, // 压缩 script 标签
        })
      )
      .pipe(gulp.dest("./dist/html"));
  }

  function data() {
    return gulp.src("./data/**").pipe(gulp.dest("./dist/data"));
  }
  function clear() {
    return gulp.src(["./dist"]).pipe(gulpclean());
  }
  function web() {
    return gulp.src("./dist").pipe(
        webserver({
            host: "localhost", // 域名
            port: 3000, // 监听的端口号，统一写 3000
            open: "./html/index.html", // 打开的页面，相对于 dist 文件夹来的目录
            livereload: true, // 浏览器自动刷新,
            proxies: [
                {
                    source: "/sa", //随便起，相当于你要请求接口的替换名 ajax请求时就用这个名字
                    target: "http://localhost/gzchen.com/cake/api/", //需要请求的接口
                },
            ],
        })
    );
}

function watch(){
    gulp.watch('./css',css);
    gulp.watch('./html',html);
    gulp.watch('./js',js);
    gulp.watch('./data',data);
}
  exports.css = css;
  exports.js = js;
  exports.html = html;
  exports.data = data;
  exports.web = web;
  exports.clean = clear;
  exports.build = gulp.series(clear, gulp.parallel(css, js, html,data),web,watch);